<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>贷款估算金融工具</title>
    <!--<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0,maximum-scale=1.0,user-scalable=no;">-->
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<link rel="stylesheet" type="text/css" href="css/main.css" />
    <link rel="stylesheet" href="css/style.css">
	<script src="js/jquery-1.7.2.js"></script>
	<script src="layer_mobile/layer.js"></script>
	<script src="js/vue.js"></script>
</head>
<body>
    <div class="yaoyiyao" id="app">
		<div class="loading">
			<img src="images/loading.png" class="Rotation">
			<p>正在计算中...</p>
		</div>
        <h5 class="sel seldata">
            <span>姓名：</span>
            <div><input type="text" placeholder="请输入姓名" v-model="useName"/></div>
        </h5>
        <h5 class="sel seldata">
            <span>手机号：</span>
            <div><input type="text" placeholder="手机号" v-model="mobile"/></div>
        </h5>
        <h5 class="sel seldata">
            <span>身份证号：</span>
            <div><input type="text" placeholder="身份证号" v-model="idCard"/></div>
       </h5>
		<h5 class="sel seldata">
            <span>银行卡号：</span>
            <div><input type="text" placeholder="银行卡号" v-model="bankCard"></div>
       </h5>
       	<h5 class="person_txt">
       		<i class="checked"></i><span>我已看过并同意<b class="xieyi">《数字展厅网络服务协议》</b></span>
       		<input type="checkbox" class="yu_ckd" checked="checked">
       	</h5>
       	<h5 class="person_txt2">温馨提示：数字展厅将对您的资料严格保密，请放心填写。</h5>
        <a class="dataSub" href="javascript:;" @click="submit">提交</a>  
    </div>
    <section  id="box2" class="box_sy1" ></section>
    	<div class="sucs">
    		<p>您的在线审核出来了！您大约能贷</p>
    		<p class="txt2_2">12个月可贷：<b class="num_show"> 56-66 </b>万</p>
    		<p class="txt2_2">36个月可贷：<b class="num_show2"> 56-66 </b>万</p>
    		<div class="yes_close">关闭</div>
    	</div>
    	<div class="sucs2">
    		<p class="error_txt">请求失败</p>
    		<div class="yes_close2">关闭</div>
    	</div>
		<section id="box" class="box_sy">
			<i class="closed"></i>
			<h2 class="h2_sy">无线网络上网服务使用协议</h2>
			<div class="pd_txt">
				<p>在使用由北京精准沟通国际传媒广告有限公司（以下简称“精准公司”）提供的无线上网服务（“本服务”）前，请仔细阅读以下条款。您使用本服务，即表示您同意并接受本协议，以及精准公司不时在没有预先通知的情况下对本协议作出的修改及／或修订。如不同意本协议，请立即关闭浏览器及结束连线并停止继续使用本服务。</p>
				<p>1. 使用者须遵守所在国家或地区所适用的所有法律、法规</p>
				<p>2. 使用者须配备支持Wi-Fi的无线装置及相关软件才能使用本服务。建议使用者使用服务时，采用提供较佳数据保护功能的加密连结通道。</p>
				<p>3. 使用者不得利用本服务浏览或存取含有淫亵、不雅或非法内容的网页，亦不得利用本服务参与非法赌博或其他非法活动。</p>
				<p>4. 使用者不得利用本服务进行未经许可上下载或作出任何侵犯知识产权的行为。有关保护知识产权的详尽资料，可参阅知识产权部门的网页。</p>
				<p>5. 如发现或知悉使用者进行未经许可上下载或作出任何侵犯知识产权的行为或其他非法活动，精准公司可采取其认为适当的行动，包括但不限于把个案转交有关团体或部门调查或采取行动，以及终止该使用者使用本服务。</p>
				<p>6. 使用者将使精准公司免于承担政府机构或第三方施加的，由于使用者未能遵从本使用守则及相关法律法规，而导致的任何及所有索赔、责任、义务、成本、费用、处罚、罚款、没收以及裁决的不利后果。</p>
				<p>7. 在使用本服务时，使用者不得对他人造成不便或滋扰。如接获有关投诉或知悉上述行为，精准公司可停止使用者使用本服务。</p>
				<p>8. 使用者知悉并同意，如有需要，精准公司有权及全权决定停止任何人士使用本服务。</p>
				<p>9. 使用者知悉并同意，精准公司会保留使用者接入互联网的活动信息，包括但不限于用户的IP地址、登录时间、退出时间等。使用者的浏览记录可以用于维修服务、统计用量、数据分析及应用。除了因应法律、法规或法庭命令的要求、执法需要或为了防止或制止非法活动和违反本守则的行为外，任何记录内的数据将不会披露予任何未经授权的个人或组织。对任何因披露数据而导致任何损失、破坏或损害﹝包括但不限于直接、间接、特别或后果性的损失、破坏或损害﹞，精准公司不会承担或接受任何法律责任、义务或责任。</p>
				<p>10. 使用者知悉并同意，使用本服务，须自行承担风险。使用者应留意使用本服务的风险，包括但不限于：信息安全风险、数据传送受阻、延误或故障，以及电脑病毒或恶意软体感染。精准公司并不保证使用本服务时数据的安全传送，有关本服务的安全特性，请参考本服务支持使用的安全协议。如因本服务、使用本服务或不当使用本服务而导致任何损失、破坏或损害（包括但不限于直接、间接、特别或随后的损失、破坏或损害），精准公司不会承担或接受任何法律责任、义务。</p>
				
				<p>11. 使用者知悉并同意，使用本服务上下载时，须自行承担风险。在任何情况下，精准公司均无须对由于使用本服务所引起的任何直接的、间接的、特别的或后果性的损失承担责任，包括但不限于任何利润损失、业务中断、程序或数据丢失，即使精准公司被明确告知此类损害的可能性。<p>
				<p>12. 使用者知悉并同意，连接至通过本网络传递或提供的外界网络的内容，须自行承担风险。<p>
				<p>13. 在本守则内特定名词的释义为：<p>
				<p>* “知识产权”指专利、商标、服务商标、商用名称、设计权、版权、互联网域名、数据库权利、知识、新发明、设计工序或方法的权利，以及其他知识产权；不论其性质、在何处产生、属已知或其后产生，或有关知识产权是否已经注册及包括要求获授任何有关权利的申请。
* “使用者”指使用本服务的任何人士。<p>
			</div>
			
		</section>
		
	</section>
    <script>
			var vm=new Vue({
				el:'#app',
				data:{
					useName:'',
					mobile:'',
					idCard:'',
					bankCard:'',
				},
				methods:{
					submit:function (){
//						用户名判断
						var reg=/^[A-Za-z0-9\u4e00-\u9fa5_]+$/;
						if(!reg.exec(vm.useName))
						{
							layer.open({
							    content: '请检查输入姓名是否有误！'
							    ,skin: 'msg'
							    ,time: 2 //2秒后自动关闭
							  });
							return false;
						}
//						手机号判断
						var reg2=/^1[34578]\d{9}$/;
						if(!reg2.exec(vm.mobile))
						{
							layer.open({
							    content: '请输入正确的手机号！'
							    ,skin: 'msg'
							    ,time: 2 //2秒后自动关闭
							  });
							return false;
						}
//						银行卡判断
						var reg3= /^(\d{16}|\d{18}|\d{19})$/;
						if(!reg3.exec(vm.bankCard))
						{
							layer.open({
							    content: '请输入正确的银行卡号！'
							    ,skin: 'msg'
							    ,time: 2 //2秒后自动关闭
							  });
							return false;
						}
//						身份证号判断
						var reg4= /^(\d{15}$|^\d{18}$|^\d{17}(\d|X|x))$/;
						if(!reg4.exec(vm.idCard))
						{
							layer.open({
							    content: '请输入正确的身份证号！'
							    ,skin: 'msg'
							    ,time: 2 //2秒后自动关闭
							  });
							return false;
						}

						if($('.yu_ckd').is(':checked')){
							
						}else{
							layer.open({
							    content: '请同意无线网络使用协议!'
							    ,skin: 'msg'
							    ,time: 2 //2秒后自动关闭
							  });
							return false;
						}
						
//						提交
						$.ajax({
							url: "loan.php",
							type: "get",
							dataType: "json",
							data:'{"userName":"'+vm.useName+'","mobile":"'+vm.mobile+'","bankCard":"'+vm.bankCard+'","idCard":"'+vm.idCard+'"}',
							beforeSend:function(XMLHttpRequest){
								//alert('远程调用开始...');
								$(".loading").show();
							},
							success: function (data) {
								$(".loading").hide();
//								alert(data['status']);
								if (data['status']==0||data['resCode']=='0001') {
//									alert(data['statMsg']);
									$('.error_txt').html(data['statMsg']);
									$('.sucs2,#box2').show();
								}else{
//									alert(JSON.stringify( data ));
//									alert(data['one_msg']);
									$('.num_show').html(data['one_msg']);
									$('.num_show2').html(data['two_msg']);
									$('.sucs,#box2').show();
								}
//								alert(data);
//								console.log(data);
								//var json={"status":1,"one_year":"12","one_msg":"2.596-2.684","two_year":"36","two_msg":"7.876-7.964"};

//								$('.num_show').html(json.one_msg);
//								$('.num_show2').html(json.two_msg);
//								$('.sucs,#box2').show();
								
							 },
							error: function () {
								$(".loading").hide();
//								 alert('提交失败');
//								$('.error_txt').html('');
								$('.sucs2,#box2').show();
							 }
						});
					}
				}
			})
		</script>
		<script>
//			协议勾选
			$('.person_txt i').toggle(function (){
				$(this).removeClass('checked');
				$('.yu_ckd').removeAttr('checked');
			},function (){
				$(this).addClass('checked');
				$('.yu_ckd').attr('checked','checked');
			});
			$('.xieyi').click(function (){
				$('#box2,#box').show();
			});
			$('.closed').click(function (){
				$('#box2,#box').hide();
			});
			
//			关闭按钮
			$('.yes_close').click(function (){
				$('.sucs,#box2').hide();
			})
			$('.yes_close2').click(function (){
				$('.sucs2,#box2').hide();
			})
		</script>
</body>
</html>